//index.js
//获取应用实例
const app = getApp()
const Pager = require('components/aotoo/core')
const util = require('../../utils/util.js')

const data = [
  {
    title: 'Day1',
    points: [{latitude: 23.184392, longitude: 113.327042, content: '春兰花园'}, {latitude: 23.140152, longitude: 113.265621, content: '越秀公园',}, {latitude: 23.162379, longitude: 113.211939, content: '横沙村'}]
  },
  {
    title: 'Day2',
    points: [{latitude: 23.040202, longitude: 115.258959, content: '莲花山度假村'}, {latitude: 22.762464, longitude: 115.372005, content: '汕尾妈祖',}, {latitude: 22.659387, longitude: 115.570256, content: '红海湾旅游区'}]
  }
]

Pager({
  data: {
    mapWrap: Pager.list({$$id: 'list', data: []}),
    padding: [200,200,200,200],
  },
  mapWrap: null,
  mapCtx: null, 
  isAd: false, 
  onItemMap(e, params, inst) {
    const that = this
    let {name, type, typeNum, latitude, longitude} = params
    latitude = parseFloat(latitude)
    longitude = parseFloat(longitude)
    if (type === '1' && !this.isAd) {
      util.stimulateAD('adunit-c070332b96523301', function() {
        that.isAd = true
        console.log('==============333')
      })
      return 
    }
    this.mapCtx.moveToLocation({
      latitude: latitude,
      longitude: longitude
    })
    this.setData({
      markers: adapterMarkers(data[type].points, typeNum),
    })
  },
  onToMap(e, params, inst) {
    const name = params.name
    const latitude = parseFloat(params.latitude)
    const longitude = parseFloat(params.longitude)
    this.mapCtx.openMapApp({
      destination: name, 
      latitude: latitude,
      longitude: longitude,
      success() {
        console.log('========xxx')
      },
      fail(parmas) {
        console.log(parmas)
        wx.showToast({title: '当前微信版本过低，请升级到最新版本再来尝试', icon: 'none'})
      },
      complete(parmas) {
        console.log('========complete', parmas)
      }
    })
  },
  
  onMenus(e, params, inst) {
    const that = this
    that.adx(e, params, inst)
    // if (!this.isAd) {
    //   util.stimulateAD('adunit-c070332b96523301', function() {
    //     that.isAd = true
    //     that.adx(e, params, inst)
    //   })
    // }
    // else {
    //   that.adx(e, params, inst)
    // }
  },
  adx(e, params, inst) {
    const type = params.type
    inst.addClass('active')
    inst.siblings().removeClass('active')

    const listInst = this.getElementsById('item-'+type)
    let listInstx = null
    listInst.removeClass('disN')
    switch (type) {
      case '0':
        listInstx = this.getElementsById('item-1')
        break;
      default:
        listInstx = this.getElementsById('item-0')
        break;
    }
    listInstx.addClass('disN')
    this.setData({
      polyline: adapterPoints(data[type].points),
      markers: adapterMarkers(data[type].points),
      includePoints: adaterJWD(data[type].points)
    })
  },
  onShow: function () {},
  onReady: function () {
    this.mapCtx = wx.createMapContext('mapId')
    this.mapWrap = this.getElementsById('list')

    this.mapWrap.update(adapterWrap(data))
    this.setData({
      polyline: adapterPoints(data[0].points),
      markers: adapterMarkers(data[0].points),
      includePoints: adaterJWD(data[0].points)
    })
  },
  onLoad: function () {
   
  },
})


function adaterJWD (data) {
  return data.map(item => {
    return {
      latitude: item.latitude,
      longitude: item.longitude,
    }
  })
}

function adapterWrap (data) {
  let header = []
  let output = []
  function abc(res, type) {
    return res.map((item, ii) => {
      return {
        img: {
          src: '/images/saui-al.png',
          itemClass: 'item-pic'
        },
        title: item.content,
        footer: [{
          title: '导航', 
          aim: 'onToMap?name='+item.content+'&latitude='+item.latitude+'&longitude='+item.longitude,
        }],
        footerClass: 'item-click',
        itemClass: 'item-item',
        aim: 'onItemMap?name='+item.content+'&latitude='+item.latitude+'&longitude='+item.longitude+'&type='+type+'&typeNum='+ii,
      }
    })
  }
  data.map((item, ii) => {
    header.push({title: item.title, itemClass: ii === 0 ? 'active' : '', aim: 'onMenus?type='+ii})
    output.push({
      '@list': {
        $$id: 'item-'+ii, 
        data: abc(item.points, ii),
        listClass: ii !== 0 ? 'disN' : ''
      }
    })
  })
  return {
    title: {'@list': {data: header, listClass: 'item-head'}},
    body: output,
    bodyClass: 'item-body',
    itemClass: 'map-wrap'
  }
}

function adapterPoints(data) {
  return [{
    color: '#FFD500',
    width: 2,
    arrowLine: true,
    points: adaterJWD(data)
  }]
}
function adapterMarkers(data, type){
  return data.map((item, ii) => {
    const idx = ii + 1
    return {
      id: ii,
      label: {
        content: idx.toString(),
        fontSize: 12,
        borderWidth: 3,
        borderRadius: 25,
        bgColor: type == ii ? '#FF6B1F' : '#FFD500',
        borderColor: '#fff',
        width: 25,
        height: 25,
        anchorY: -10,
        anchorX: -6,
        textAlign: 'center'
      },
      callout: {
        content: item.content,
        padding: 5,
        fontSize: 12,
        borderWidth: 1,
        borderRadius: 4,
        bgColor: '#fff',
        borderColor: '#fff',
        display: 'ALWAYS',
        anchorY: -10,
        anchorX: 10,
        textAlign: 'left',
      },
      // anchor: {x: .1, y: 2},
      iconPath: "../../images/saui-al.png",
      latitude: item.latitude,
      longitude: item.longitude,
      width: 1,  //图片显示宽度
      height: 1  //图片显示高度
    }
  })
}